
$(function () {
    last();
    echarts_1();
    map();
    echarts_4();
    echarts_5();
    echarts_6();
    fast();
})
function last() {
    $.ajax({
        url: "/lastAjax",
        type: "get",
        dataType: "json",
        success: function (gg) {
            // 基于准备好的dom，初始化echarts实例

            document.getElementById("more").innerHTML=gg.x;
        }
    })
}
function fast() {
    $.ajax({
        url: "/fastAjax",
        type: "get",
        dataType: "json",
        success: function (gg) {
            // 基于准备好的dom，初始化echarts实例

            document.getElementById("shao").innerHTML=gg.x;
        }
    })
}
//疫情人数占比
function echarts_1() {

    var provinceName = document.getElementById("nameSelect").value;
    $.ajax({
        url:"/zhanAjax",
        type:"get",
        data:{"provinceName":provinceName},
        dataType:"json",
        success:function (smg) {
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('echarts_1'));

            var option = {
                backgroundColor: 'rgba(0,0,0,0)',
                tooltip: {
                    trigger: 'item',
                    formatter: "{b}: <br/>{c} ({d}%)"
                },
                color: [ '#20b9cf', '#2089cf', '#205bcf'],
                legend: { //图例组件，颜色和名字
                    x: '70%',
                    y: 'center',
                    orient: 'vertical',
                    itemGap: 12, //图例每项之间的间隔
                    itemWidth: 10,
                    itemHeight: 10,
                    icon: 'rect',
                    data: ['确认', '治愈', '死亡'],
                    textStyle: {
                        color: [],
                        fontStyle: 'normal',
                        fontFamily: '微软雅黑',
                        fontSize: 12,
                    }
                },
                series: [{
                    name: '白酒品牌前三占比',
                    type: 'pie',
                    clockwise: false, //饼图的扇区是否是顺时针排布
                    minAngle: 20, //最小的扇区角度（0 ~ 360）
                    center: ['35%', '50%'], //饼图的中心（圆心）坐标
                    radius: [40, 60], //饼图的半径
                    //  avoidLabelOverlap: true, ////是否启用防止标签重叠
                    itemStyle: { //图形样式
                        normal: {
                            borderColor: 'transparent',
                            borderWidth: 2,
                        },
                    },
                    label: { //标签的位置
                        normal: {
                            show: true,
                            position: 'inside', //标签的位置
                            formatter: "{d}%",
                            textStyle: {
                                color: '#fff',
                            }
                        },
                        emphasis: {
                            show: true,
                            textStyle: {
                                fontWeight: 'bold'
                            }
                        }
                    },
                    data: smg.zhan
                }, {
                    name: '',
                    type: 'pie',
                    clockwise: false,
                    silent: true,
                    minAngle: 20, //最小的扇区角度（0 ~ 360）
                    center: ['35%', '50%'], //饼图的中心（圆心）坐标
                    radius: [0, 40], //饼图的半径
                    itemStyle: { //图形样式
                        normal: {
                            borderColor: '#1e2239',
                            borderWidth: 1.5,
                            opacity: 0.21,
                        }
                    },
                    label: { //标签的位置
                        normal: {
                            show: false,
                        }
                    },
                    data: smg.zhan
                }]
            };

            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize",function(){
                myChart.resize();
            });

        }
    })

}
//中国新冠疫情人数死亡分布
function map() {
    $.ajax({
        url:"/welcomeAjax",
        type:"get",
        dataType:"json",
        success:function(data) {
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('map'));

            var option = {

                title: {
                    text: '',
                    textStyle:{color:'#fff'},
                    //subtext: '纯属虚构',
                    x:'center'
                },
                tooltip : {
                    trigger: 'item'
                },
                visualMap: {
                    show : false,
                    x: 'left',
                    y: 'bottom',
                    //layoutCenter:['30%','30%'],
                    splitList: [
                        {start: 0, end:10},
                        {start: 10, end: 100},
                        {start: 100, end: 5000}
                    ],
                    color: ['red','yellow','green']
                },
                series: [{
                    name: '死亡人数',
                    type: 'map',
                    mapType: 'china',
                    roam: true,
                    label: {
                        normal: {
                            show: true
                        },
                        emphasis: {
                            show: false
                        }
                    },
                    data:data.welcome,
                }]
            };

            myChart.setOption(option);
            window.addEventListener("resize",function(){
                myChart.resize();
            });
        }
    })

}


//新冠疫情确诊人数TOP5
function echarts_4() {
    $.ajax({
        url:"/bingAjax",
        type:"get",
        dataType:"json",
        success:function (data) {
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('echarts_4'));

            option = {

                tooltip : {
                    trigger: 'item',
                    formatter: "{b}: <br/>  {c} ({d}%)"
                },

                toolbox: {
                    show : false,
                    feature : {
                        mark : {show: true},
                        dataView : {show: true, readOnly: false},
                        magicType : {
                            show: true,
                            type: ['pie', 'funnel']
                        },
                        restore : {show: true},
                        saveAsImage : {show: true}
                    }
                },
                calculable : true,
                series : [

                    {
                        name:'排名',
                        type:'pie',
                        color: ['#33b565', '#20cc98', '#20b9cf', '#2089cf', '#205bcf'],
                        radius : [20, 70],
                        center : ['50%', '50%'],
                        roseType : 'area',
                        data:data.bing,
                    }
                ]
            };


            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize",function(){
                myChart.resize();
            });
        }
    })

}
//新冠疫情治愈人数TOP5
function echarts_5() {
    $.ajax({
        url:"/zhuAjax",
        type:"get",
        dataType:"json",
        success:function (gg) {
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('echarts_5'));

            var xData = function() {
                var data = gg.x;

                return data;
            }();

            var data = gg.y

            option = {
                // backgroundColor: "#141f56",

                tooltip: {
                    show: "true",
                    trigger: 'item',
                    backgroundColor: 'rgba(0,0,0,0.4)', // 背景
                    padding: [8, 10], //内边距
                    // extraCssText: 'box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);', //添加阴影
                    formatter: function(params) {
                        if (params.seriesName != "") {
                            return params.name + ' ：  ' + params.value + ' 人';
                        }
                    },

                },
                grid: {
                    borderWidth: 0,
                    top: 20,
                    bottom: 35,
                    left:40,
                    right:10,
                    textStyle: {
                        color: "#fff"
                    }
                },
                xAxis: [{
                    type: 'category',

                    axisTick: {
                        show: false
                    },

                    axisLine: {
                        show: true,
                        lineStyle: {
                            color:'rgba(255,255,255,0.2)',
                        }
                    },
                    axisLabel: {
                        inside: false,
                        textStyle: {
                            color: '#bac0c0',
                            fontWeight: 'normal',
                            fontSize: '12',
                        },
                        // formatter:function(val){
                        //     return val.split("").join("\n")
                        // },
                    },
                    data: xData,
                }, {
                    type: 'category',
                    axisLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false
                    },
                    splitArea: {
                        show: false
                    },
                    splitLine: {
                        show: false
                    },
                    data: xData,
                }],
                yAxis: {
                    min:10,
                    type: 'value',
                    axisTick: {
                        show: false
                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.2)',
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.1)',
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: '#bac0c0',
                            fontWeight: 'normal',
                            fontSize: '12',
                        },
                        formatter: '{value}',
                    },
                },
                series: [{
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            show: true,
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                offset: 0,
                                color: '#00c0e9'
                            }, {
                                offset: 1,
                                color: '#3b73cf'
                            }]),
                            barBorderRadius: 50,
                            borderWidth: 0,
                        },
                        emphasis: {
                            shadowBlur: 15,
                            shadowColor: 'rgba(105,123, 214, 0.7)'
                        }
                    },
                    zlevel: 2,
                    barWidth: '20%',
                    data: data,
                },
                    {
                        name: '',
                        type: 'bar',
                        xAxisIndex: 1,
                        zlevel: 1,
                        itemStyle: {
                            normal: {
                                color: 'transparent',
                                borderWidth: 0,
                                shadowBlur: {
                                    shadowColor: 'rgba(255,255,255,0.31)',
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowOffsetY: 2,
                                },
                            }
                        },
                        barWidth: '20%',
                        data: [30, 30, 30, 30, 30]
                    }
                ]
            }


            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize",function(){
                myChart.resize();
            });

        }
    })

}
//新冠疫情死亡人数TOP3
function echarts_6() {

    $.ajax({
        url:"/paiAjax",
        type:"get",
        dataType:"json",
        success:function (data) {
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('echarts_6'));



            var option = {

                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                grid: {
                    left:40,
                    right:20,
                    top:30,
                    bottom:0,
                    containLabel: true
                },

                xAxis: {
                    type: 'value',
                    axisLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,220)'
                        }
                    },
                    splitLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,0)'
                        }
                    },
                    axisLabel:{
                        color:"rgba(255,255,255,0)"
                    },
                    boundaryGap: [0, 0.01]
                },
                yAxis: {
                    type: 'category',
                    axisLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,5)'
                        }
                    },
                    splitLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,1)'
                        }
                    },
                    axisLabel:{
                        color:"white"
                    },
                    data: data.y
                },
                series: [
                    {
                        name: '2020年4月13日-2020年4月21日',
                        type: 'bar',
                        barWidth :20,
                        itemStyle: {
                            normal: {
                                color:'#2089cf',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        },
                        data: data.x
                    }
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize",function(){
                myChart.resize();
            });
        }
    })

}
